<template>
  <div class="header-title">当前主题</div>
  <div class="layout">
    <div class="layout-item">
      <div>
        <img src="@/assets/svg/running.svg" alt="" />
      </div>
      <div>运行中</div>
    </div>
    <div class="layout-item">
      <div>
        <img src="@/assets/svg/u3262.png" alt="" />
      </div>
      <div>维护中</div>
    </div>
    <div class="layout-item">
      <div>
        <img src="@/assets/svg/2.svg" alt="" />
      </div>
      <div>服务到期</div>
    </div>
  </div>
</template>

<script setup lang="ts"></script>

<style scoped lang="scss">
.header-title {
  font-size: 18px;
  font-weight: bold;
  color: #303133;
  padding-bottom: 30px;
}
.layout {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  .layout-item {
    margin-bottom: 60px;
    div {
      font-size: 21px;
      color: #666;
      text-align: center;
    }
    img {
      width: 90px;
      height: 90px;
      margin-bottom: 30px;
    }
  }

}
</style>
